<template>
  <view class="relayTheMessage" :style="DynamicHeight">
    <up-navbar title="文档管理" :autoBack="false" placeholder @leftClick="leftClick" rightIcon="more-dot-fill"
      @rightClick="rightClick"></up-navbar>

    <view>
      <view class="info-bar">
        <view>江苏绿港现代农业发展股份有限公司</view>
        <view>使用容量</view>
      </view>

      <view>
        <up-input placeholder="搜索文件" border="surround" v-model="keyword" @change="searchchange" shape="circle"
          :customStyle="{
            width: '89vw', margin: '0  auto', placeholderColor: '#999', borderColor: '#ddd',
          }" prefixIcon="search"></up-input>
      </view>

      <view :style="tabsDynamicHeight">
        <allFiles :tabsDynamicHeight="tabsDynamicHeight" v-if="tabbarvalue == 0"></allFiles>
        <collectFiles :tabsDynamicHeight="tabsDynamicHeight" v-if="tabbarvalue == 1"></collectFiles>
        <groupFile :tabsDynamicHeight="tabsDynamicHeight" v-if="tabbarvalue == 2"></groupFile>
        <myDocument :tabsDynamicHeight="tabsDynamicHeight" v-if="tabbarvalue == 3"></myDocument>
      </view>

      <u-tabbar :value="tabbarvalue" :safeAreaInsetBottom="true" @change="handleTabChange" activeColor="#2979ff">
        <u-tabbar-item text="全部文件" icon="file-text"></u-tabbar-item>
        <u-tabbar-item text="收藏文件" icon="star"></u-tabbar-item>
        <u-tabbar-item text="群组文件" icon="man-add"></u-tabbar-item>
        <u-tabbar-item text="我的文件" icon="account"></u-tabbar-item>
      </u-tabbar>
    </view>
  </view>
</template>

<script>
import { retrieveMemory } from '@/apis/ocumentManagement/index'
import allFiles from '@/pages/ocumentManagement/components/allFiles'
import collectFiles from '@/pages/ocumentManagement/components/collectFiles'
import groupFile from '@/pages/ocumentManagement/components/groupFile'
import myDocument from '@/pages/ocumentManagement/components/myDocument'
export default {
  name: 'ocumentManagement',
  components: {
    allFiles,
    collectFiles,
    groupFile,
    myDocument
  },
  data () {
    return {
      height: 0,
      DynamicHeight: {},
      tabsDynamicHeight: {},
      tabbarvalue: 0
    }
  },
  created () {
    this.height = (uni.getSystemInfoSync().windowHeight || uni.getSystemInfoSync().screenHeight) || 0

    this.DynamicHeight = {
      height: `${this.height}px`,
      overflow: 'hidden'
    }
    // #ifdef APP-PLUS

    this.tabsDynamicHeight = {
      height: `${this.height - 180}px`,
      overflow: 'hidden',
      marginTop: '6rpx',
    }
    // #endif

    // #ifdef H5
    this.tabsDynamicHeight = {
      height: `${this.height - 159}px`,
      overflow: 'hidden',
      marginTop: '6rpx',
    }
    // #endif
  },
  methods: {
    async getretrieveMemory () {
      try {
        let res = await retrieveMemory()
        console.log('res', res);

      } catch (error) {

      }
    },
    handleTabChange (index) {
      this.tabbarvalue = index
    },
    // 返回键
    leftClick () {
      uni.navigateBack()
    },
    // 更多键
    rightClick () {
      console.log('更多');

    },
  }

}
</script>

<style lang="scss" scoped>
.relayTheMessage {
  width: 100%;
  // background-color: #ffffff;

  .info-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 26rpx;
    padding: 0 15rpx 5rpx;
    gap: 10rpx;
    color: #8a8b8c;
  }
}
</style>